<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <link rel="stylesheet" href="./common/lib/bootstrap/bootstrap.css"/>
    <link rel="stylesheet" href="./common/lib/swiper/swiper.min.css"/>
    <link rel="stylesheet" href="./common/css/common.css"/>
    <link rel="stylesheet" href="css/debt-confirm.css"/>

    <!--[if lte IE 8]>
    <script src="./common/lib/html5/excanvas.js"></script>
    <script src="./common/lib/html5/html5.js"></script>
    <![endif]-->
</head>
<body>

<header>
    <div class="page-head-top">
        <div class="page-container  clearfix">
            <div class="page-top-left">
                <a class="tel" href="tel:400-064-5188"><span>客服电话:</span>400-064-5188</a><i class="weix"></i><i
                    class="sina"></i>
            </div>
            <div class="page-top-right clearfix">
                <ul>
                    <!--    TODO   登录状态切换  start    -->
                    <!--<li class="offline"><a href="#">登录</a><a href="#" class="active">注册</a></li>-->
                    <li class="online">你好:<a href="#" class="active">小明</a><a href="#">退出</a></li>
                    <!--    TODO   登录状态切换  end    -->
                    <li><a class="icon-phone" href="#">手机客户端</a></li>
                    <li><a href="#">新手指引</a></li>
                    <li><a href="#">帮助中心</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="navigator">
        <div class="page-container clearfix">
            <nav>
                <a href="#" class="logo"><img src="./common/img/header/logo.png" alt="logo程诺金服，稳健透明创新"/></a>
                <ul class="nav-link">
                    <li><a href="#" class="active">首页</a></li>
                    <li><a href="#">我的投资</a></li>
                    <li><a href="#">安全保障</a></li>
                    <li><a href="#">关于我们</a></li>
                    <li><a href="#" class="nav-btn">我的账户</a></li>
                </ul>
            </nav>
        </div>
    </div>
</header>

<div class="page-container">
    <h5 class="crumbs-nav">当前位置：程诺金服&gt;<a href="#">投资步骤</a></h5>
</div>
<div class="page-container confirm-wrap">
    <section>
        <h3 class="item-title">投资项目</h3>

        <div class="item">
            <ul class="debt-info">
                <li><span>项目名称：POS贷项目1</span><span>年化收益：12.00％</span></li>
                <li><span>还款方式：按月付息，到期还本</span><span>计息天数：60天</span></li>
                <li><span>债务方：有限公司</span><span>担保方：担保公司</span></li>
                <li><span>起息日期：2016-07-08</span><span>还款日期：2016-09-08</span></li>
            </ul>
        </div>
    </section>
    <section>
        <h3 class="item-title">确认投资</h3>

        <div class="item">
            <form>
                <div class="amount">
                    <span class="pull-left">投资金额：<b>100.00</b>元</span>

                    <div data-select class="select-wrap pull-left">
                        <span data-select-text class="select-input">当前没有可用优惠券／请选择优惠券</span>
                        <input id="redBag" type="text" class="hide" />
                        <ul data-select-dom class="select-option">
                            <li>不使用优惠券</li>
                            <li data-value="1"><span class="red-bag-name">代金券红包</span><span class="red-bag-amount">10元</span>还有10天过期</li>
                            <li data-value="2"><span class="red-bag-name">体验金红包</span><span class="red-bag-amount">10元</span>还有10天过期</li>
                            <li data-value="3"><span class="red-bag-name">优惠券红包</span><span class="red-bag-amount">10元</span>还有10天过期</li>
                            <li data-value="4"><span class="red-bag-name">红包</span><span class="red-bag-amount">10元</span>还有10天过期</li>
                        </ul>
                    </div>
                    <span class="pull-right">预期收益：<b class="text-large">11.96</b>元</span>
                </div>
                <hr/>
                <div class="balance clearfix">
                    <span>账户余额：<b>2000.00</b>元</span><span class="pull-right">投资支付：<b>100.00</b>元</span>
                </div>
                <div class="code">
                    <label for="code">验证码：</label>

                    <div class="code-input">
                        <input id="code" type="text"/>
                        <label for="code"><img src="" alt="验证码"/></label>
                    </div>
                </div>
                <div>
                    <input id="agreement" type="checkbox" checked/>
                    <label for="agreement">我同意<a href="#">使用条款</a>和<a href="#">隐私条款</a></label>
                </div>
                <button class="debt-btn hover fade-shadow" type="submit">确认投资</button>
            </form>
        </div>
    </section>
</div>

<footer>
    <div class="footer-top">
        <ul>
            <li><a href="#" class="active">首页</a></li>
            <li><a href="#">我的投资</a></li>
            <li><a href="#">安全保障</a></li>
            <li><a href="#">关于我们</a></li>
            <li><a href="#">我的账户</a></li>
        </ul>
    </div>
    <div class="footer-middle">
        <div class="page-container">
            <div class="footer-middle-item footer-middle-left">
                <span class="icon-tel">客服热线：</span>
                <strong class="tel-number">400-064-5188</strong>
                <span class="work-time">工作日：9:00-18:00</span>
            </div>
            <div class="footer-middle-item footer-middle-center">
                <div class="code-item">
                    <h3>官方微信</h3>
                    <img width="94" height="94" src="./common/img/footer/weix.png" alt="官方微信二维码"/>
                </div>
                <div class="code-item">
                    <h3>程诺APP</h3>
                    <img width="94" height="94" src="./common/img/footer/app.png" alt="程诺APP二维码"/>
                </div>
            </div>
            <div class="footer-middle-item footer-middle-right">
                <dl>
                    <dt><a href="#">关于程诺</a></dt>
                    <dd><a href="#">程诺介绍</a></dd>
                    <dd><a href="#">媒体报道</a></dd>
                    <dd><a href="#">招贤纳士</a></dd>
                </dl>
                <dl>
                    <dt><a href="#">安全保障</a></dt>
                    <dd><a href="#">资金安全</a></dd>
                    <dd><a href="#">技术保障</a></dd>
                    <dd><a href="#">风控体系</a></dd>
                </dl>
                <dl>
                    <dt><a href="#">帮助中心</a></dt>
                    <dd><a href="#">新手指引</a></dd>
                    <dd><a href="#">相关法律</a></dd>
                </dl>
            </div>
        </div>
    </div>
</footer>

<script src="./common/lib/jquery/jquery-1.11.1.min.js"></script>
<script src="./common/lib/bootstrap/bootstrap.js"></script>
<script src="./common/js/common.js"></script>
<script src="js/debt-confirm.js"></script>
</body>
</html>